<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <input type="text" id="txt1" value="">
  <input type="button" id="btn1" value="校验">
  <script>
    window.onload = function() {
      const txt1 = document.getElementById('txt1')
      const oBtn = document.getElementById('btn1')

      oBtn.onclick = function() {
        // 邮箱：---是abc@qq.com。这个是一个非法的邮箱，test认为其中一部分符合，就会判断为合法，返回true
        // const re = /\w+@[a-z0-9]+\.[a-z]+/i

        // 修改为
        const re = /^\w+@[a-z0-9]+\.[a-z]+$/i

        if (re.test(txt1.value)) {
          alert('邮箱合法了')
        } else {
          alert('输入有误')
        }
      }
    }
    
  </script>
</body>
</html>